@extends('index.common.common')
@section('style')
    @parent

@endsection

@section('content')
    <div class="posts">
        <blog-post v-for="post in posts" v-bind:post="post"></blog-post>
    </div>
@endsection

@section('footer')
    @parent
    <script type="text/javascript">
        Vue.component('blog-post',{
            props:['post'],
            template:'<div class="post"><h3>@{{ post.title }}</h3><div v-html="post.content"></div></div>'
        });
        var vm = new Vue({
            el:".posts",
            data:{
              posts:[]
            },
            created:function () {
                var vv = this;
                var formData = new FormData();
                formData.append('id',233);
                fetch("{{ url('index/count') }}",{method:'POST',body:formData}).then(function (response) {
                    return response.json();
                }).then(function (res) {
                    vv.posts = res.data
                })
            }
        })
    </script>
@endsection